<template>
	<div class="slhxs_com">
		<span class="nowTime week number_com">{{ nyr }}</span>
		<span class="nowTime week number_com">{{ week }}</span>
		<span class="nowTime sfm number_com">{{ sfm }}</span>
	</div>
</template>

<script>
var myDate = new Date();
var s = myDate.getHours() < 10 ? '0' + myDate.getHours() : myDate.getHours();
var f = myDate.getMinutes() < 10 ? '0' + myDate.getMinutes() : myDate.getMinutes();
var m = myDate.getSeconds() < 10 ? '0' + myDate.getSeconds() : myDate.getSeconds();

var mounthArr = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
var weekArr = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
var week = weekArr[myDate.getDay()];
var nyr = myDate.getFullYear() + '年' + mounthArr[myDate.getMonth()] + myDate.getDate() + '日';
var sfm = s + ':' + f + ':' + m;
export default {
	name: 'loginHeaderLeft',
	data() {
		return {
			nyr: nyr,
			sfm: sfm,
			week: week
		};
	},
	mounted() {
		this.getTime();
	},
	methods: {
		getTime: function() {
			var myDate = new Date();
			setInterval(() => {
				var myDate = new Date();
				var s = myDate.getHours() < 10 ? '0' + myDate.getHours() : myDate.getHours();
				var f = myDate.getMinutes() < 10 ? '0' + myDate.getMinutes() : myDate.getMinutes();
				var m = myDate.getSeconds() < 10 ? '0' + myDate.getSeconds() : myDate.getSeconds();

				var mounthArr = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
				var weekArr = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
				var week = weekArr[myDate.getDay()];
				var nyr = myDate.getFullYear() + '年' + mounthArr[myDate.getMonth()] + myDate.getDate() + '日';
				var sfm = s + ':' + f + ':' + m;
				this.sfm = sfm;
				this.nyr = nyr;
				this.week = week;
			}, 1000);
		}
	}
};
</script>

 <style scoped>
	 .nowTime {
		 color: #00aeee;
	 }
	 
	 .sfm {
		 font-size: 32px;
		 /* margin-right: 15px; */
	 }
	 
	 .week {
		 margin: 0 10px;
		 /* font-size: 8px; */
		 /* margin-right: 10px; */
	 }
 </style>